{% extends layout %}
{% block title %}菜单管理{% endblock %}
{% block content %}
<script>
    $(function(){
        /* 列表页帮助类 */
        var LPH = new ListPageHelper({ModelName:'menu'});
        /* 初始化表格参数 */
        var DTSettings = {
            "drawCallback": function (settings) {
                //复选框渲染
                $('input[type="checkbox"].minimal, input[type="radio"].minimal').iCheck({
                    checkboxClass: 'icheckbox_minimal-blue',
                    radioClass: 'iradio_minimal-blue'
                });
                //增加删除、修改事件
                $("a[name='ManageHref']").click(function () {
                    var dataID = $(this).attr("data-id");
                    var eventType = $(this).attr("event");
                    switch (eventType) {
                        case 'Delete':
                            LPH.deleteEntitys(dataID);
                            break;
                        case 'Edit':
                            LPH.editEntity(dataID);
                            break;
                    }
                });
            },
            "initComplete":function(settings,json){
                LPH.initCheckAll();
            },
            "columns": [
                { "data": "_id" ,title:"<input type=\"checkbox\" id=\"CheckAll\" />"},
                { "data": "icon" ,title:"图标"},
                { "data": "title" ,title:"标题"},
                { "data": "menu" ,title:"所属菜单"},
                { "data": "meta.updateAt" ,title:"上次修改时间"},
                { "data": "_id" ,title:"操作"}
            ],
            "columnDefs": [
                {
                    "targets": [0],
                    "data": "_id",
                    "render": function (data, type, full) {
                        return "<input type=\"checkbox\" class=\"minimal\" name=\"EntityID\" value=\"" + data + "\"/>";
                    }
                },
                {
                    "targets": [1],
                    "data": "icon",
                    "render": function (data, type, full) {
                        return "<i class='"+data+"'></i>";
                    }
                },
                {
                    "targets":[3],
                    "data":"menu",
                    "render":function(data,type,full){
                        if(data)
                            return data.title;
                        else
                            return "";
                    }
                },
                {
                    "targets":[4],
                    "data":"meta.updateAt",
                    "render":function(data,type,full){
                        return new Date(data).format("yyyy-MM-dd hh:mm:ss");
                    }
                },
                {
                    "targets":[5],
                    "data":"_id",
                    "render":function(data,type,full){
                        return "<div style=\"width:100%;text-align:center\">" +
                            "<a  data-id=\"" + data + "\" name=\"ManageHref\" event=\"Edit\" href='javascript:void(0);' >修改</a>" +
                            "&nbsp;&nbsp;&nbsp;&nbsp;<a data-id=\"" + data + "\" name=\"ManageHref\" event=\"Delete\" href='javascript:void(0);'>删除</a>"+
                            "</div>";
                    }
                }
            ]
        };
        /* 表格过滤条件 */
        function searchFilter(){
            var filter = {};
            filter.title = $("input[name='Title']").val();
            return filter;
        }
        /* 初始化表格 */
        LPH.initDataTable(DTSettings,searchFilter);
        LPH.initSearchForm();
        /* 按钮绑定开始 */
        $(".del").click(function(){
            LPH.deleteEntitys();
        });
        $(".add").click(function(){
            LPH.addEntity();
        });
        /* 按钮绑定结束 */
    });
</script>
<div class="row">
    <div class="col-xs-12">
        <div class="box box-info">
            <div class="box-header with-border">
              <h3 class="box-title">搜索</h3>

              <div class="pull-right box-tools">
                <button type="button" class="btn btn-default btn-sm" data-widget="collapse" data-toggle="tooltip" title="" >
                  <i class="fa fa-minus"></i></button>
              </div>
            </div>
            <form class="form-horizontal searchForm">
              <div class="box-body">
                <div class="form-group col-xs-3">
                  <label for="inputEmail3" class="col-sm-4 control-label">标题：</label>
                  <div class="col-sm-8">
                    <input type="text" class="form-control" name="Title" placeholder="标题">
                  </div>
                </div>
              </div>
              <div class="box-footer">
                <button type="button" class="btn btn-info pull-right search" >搜索</button>
              </div>
            </form>
          </div>
    </div>
    <div class="col-xs-12">
        <div class="box">
        <div class="box-header">
            <a href="javascript:void(0);" class="btn btn-default add">添加</a>
            <a href="javascript:void(0);" class="btn btn-danger del">删除</a>
        </div>
        <div class="box-body">
            <table id="DataTable" class="table table-bordered table-hover">
            </table>
        </div>
        </div>
    </div>
</div>
{% endblock %}